/** 品牌数据管理 */
import React, { Component } from 'react'

import './Brand.css'

import store from '../store'
import {
  brandDelAction
} from "../store/brand/brandCreator"

export default class Brand extends Component {

  delBrand(item) {
    // 删除数据
    store.dispatch(brandDelAction(item))
  }

  componentDidMount() {
    store.subscribe(() => {
      this.setState({})
    })
  }

  render() {
    return (
      <div>
        <h2>品牌数据管理</h2>
        <table cellPadding={10} cellSpacing={0}>
          <thead>
            <tr>
              <th>序号</th>
              <th>名称</th>
              <th>操作</th>
            </tr>
          </thead>
          <tbody>
            {
              store.getState().brand.map(item => (
                <tr key={item.id}>
                  <td>{item.id}</td>
                  <td>{item.name}</td>
                  <td>
                    <button>编辑</button>
                    <button onClick={() => this.delBrand(item)}>删除</button>
                  </td>
                </tr>
              ))
            }
          </tbody>
        </table>
      </div>
    )
  }
}
